<%@ page language="java" pageEncoding="UTF-8"
	contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML>
<html>
<head>
  <meta charset="UTF-8">
</head>
<body>


<table class="table">
	<thead>
		<tr>
			<th><span>roomuuid</span></th>
			<th class="table-req"><span>roomname</span></th>
			<th><span>1</span></th>
			<th><span>2</span></th>
			<th><span>3</span></th>
			<th><span>4</span></th>
			<th><span>5</span></th>
			<th><span>6</span></th>
			<th><span>7</span></th>
		</tr>
	</thead>
	<tbody>
		<c:forEach var="item" items="${rooms}">
			<tr style="" id="tr_${item.uuid}">
				<td>
					${item.uuid}
				</td>
				<td class="table-req">
					${item.name}
				</td>
				<td>
					<button data-name="${item.name}" data-uuid="${item.uuid}" data-catalog="87b4e873-b08c-4ef4-9f2c-dd2ee90d7319" class="b1">创业创新</button> 
				</td>
				<td>
					<button data-name="${item.name}" data-uuid="${item.uuid}" data-catalog="56f9c9ee-e97d-4b14-9fce-c2d7b04c2e0d" class="b2">健康</button> 
				</td>
				<td>
					<button data-name="${item.name}" data-uuid="${item.uuid}" data-catalog="98F3883D-753C-467E-B8A3-D69344881F85" class="b3">就业</button> 
				</td>
				<td>
					<button data-name="${item.name}" data-uuid="${item.uuid}" data-catalog="913259F3-3F12-4757-87DE-7AA6309BFAF6" class="b4">高考</button> 
				</td>
				<td>
					<button data-name="${item.name}" data-uuid="${item.uuid}" data-catalog="28dca0fb-ecc3-4ee1-bc63-cb1e78e7582a" class="b5">活动</button> 
				</td>
				<td>
					<button data-name="${item.name}" data-uuid="${item.uuid}" data-catalog="d461a5c1-d1b6-42be-995d-4afc2bf0cf6a" class="b6">轨道</button> 
				</td>
				<td>
					<button data-name="${item.name}" data-uuid="${item.uuid}" data-catalog="8c422bd7-8cdb-4bb3-8bcb-a78e642af1ec" class="b7">其他</button> 
				</td>

			</tr>
		</c:forEach>
	</tbody>
</table>

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script>
var output = "[\n";

for(var i = 1; i<=7 ;i++){
	
	$(".b"+i).click(function(){
		
		var uuid = $(this).data("uuid");
		var name = $(this).data("name");
		var catalog = $(this).data("catalog");
		$("#tr_"+uuid).remove();
		var el = " {\"roomuuid\":\""+uuid+"\",\"cataloguuid\":\""+catalog+"\"}, \n";
		output = output + el;
		console.log(output);
		///*  */[{roomuuid:uuid},{}]
	});
	
}

</script>
</body>
</html>